// 1. 导入`react-dom/client`
// import React from 'react';
import ReactDOM from 'react-dom/client';

// 2 创建渲染的根节点
const root = ReactDOM.createRoot(document.getElementById('root'));

// 列表数据
const arr = ['Angular', 'Vue', 'React'];
// const arr2 = [<div>Angular</div>, <div>Vue</div>, <div>React</div>];

// 列表UI
// const list = <div>{arr}</div>;
const list2 = arr.map((item, i) => {
  return (
    <div key={i}>
      {item}
      {i + 1}
    </div>
  );
});

// 渲染UI
root.render(list2);
